<template>
  <div id="club">
	  <!-- page banner -->
	  <div class="page-banner about-banner text-center">
	      <p>为<span class="text-gold">特立独行</span>的游客寻找</p>
	      <h3 class="banner-title">与众不同的酒店</h3>
	  </div>
	  <!-- crumb nav -->
	  <div class="crumb-nav">
	    <div class="fixed-wrapper">
	    	<router-link to="/home">首页</router-link><i class="line">&gt;</i>
	    	<span class="cur">会员俱乐部</span>
	    </div>
	  </div>
    <!-- club content start-->
    <div class="fixed-wrapper club-content page-content">
      <div class="club-header text-center">
        <p>全球奢华精品酒店俱乐部加入免费，首次入住即可享受优惠。加入时间越长，享受优惠更多</p>
        <p>会员甚至可以享受免费房晚住宿。赶紧行动，加入我们。首次入住，即可享受客房升级</p>
      </div>
      <ul class="club-tabnav text-center after-clear">
        <li :class="{cur: tab1}" @mouseover="handleMouseEnter(1)" ><span class="bg-text bg-text-s"></span>特别<span class="nav-tip"></span></li>
        <li :class="{cur: tab2}" @mouseover="handleMouseEnter(2)" ><span class="bg-text bg-text-l"></span>宠爱<span class="nav-tip"></span></li>
        <li :class="{cur: tab3}" @mouseover="handleMouseEnter(3)" ><span class="bg-text bg-text-h"></span>尊荣<span class="nav-tip"></span></li>
      </ul>
      <ul class="club-tabcont after-clear">
        <li v-show="tab1">
          <div class="page-title text-center"><div class="page-title-inner"><span>S特别会员-全球奢华精品酒店会员俱乐部</span></div></div>
          <div class="club-cont">
            <dl>             
              <dt>首次入住后可由S特别会员升级为L宠爱会员。作为L宠爱会员，除了可享受S特别会员所有特权外，还可享受以下权益：</dt> 
              <dd>每次入住，享受免费客房升级*（视入住时的具体情况而定）</dd>
              <dd>作为L宠爱会员，我们很高兴为您在每次入住全球精品奢华酒店时提供客房升级服务（视入住时的具体情况而定）</dd>
              <dd>每次入住，享受双人免费欧式早餐</dd>
              <dd>早餐是一天当中最重要的一餐，作为L宠爱会员，入住全球精品奢华酒店，便可享受每日双人免费欧陆早餐。</dd>
              <dd>每次入住，享受延迟退房(视入住时的具体情况而定）</dd>
              <dd>每次入住，L宠爱会员还可享受延迟退房服务（视入住时的具体情况而定），所以，入住全球任何一家全球奢华精品酒店，作为L宠爱会员，您都将拥有更充裕宽松的入住时间。</dd>
              <dd>L宠爱会员的有效期限为12个月</dd>
              <dd>在此期间，入住全球奢华精品酒店1次便可再延续享受一年的L宠爱会员特权</dd>
              <dd>在此期间，入住全球精品奢华酒店5次以上便可升级为H尊荣会员，享受更多会员特权</dd>
            </dl> 
            <p>成为全球奢华精品酒店S特别会员，首次入住后便可升级为L宠爱会员，享受更多会员特权。</p>
          </div>
        </li>
        <li v-show="tab2">
          <div class="page-title text-center"><div class="page-title-inner"><span>L宠爱会员-全球精品奢华酒店会员俱乐部</span></div></div>
          <div class="club-cont">
            <dl>             
              <dt>成为S特别会员，即刻享受以下会员特权：</dt>
              <dd>首次入住可享客房免费升级（视入住时的具体情况而定）</dd>
              <dd>成为S特别会员，入住全球奢华精品酒店，我们将很高兴为您提供客房升级服务（视入住时的具体情况而定）</dd>
              <dd>享受会员专享房价</dd>
              <dd>预订全球奢华精品酒店，便有机会享受会员专享预订特惠以及套餐特惠。其中有的酒店选择让会员享受更大的折扣，有的酒店则为会员提供终身难忘的套餐服务。</dd>
              <dd>俱乐部预订和咨询</dd>
              <dd>最近我们向欧洲地区客户已经推出了我们的预订咨询服务。专业的咨询顾问将在不久的将来加入我们的各个全球团队，联系我们的专业预订咨询团队，您将获得最适合的酒店推荐，并积极为您的入住提供及时帮助。</dd>
              <dd>定期俱乐部内刊</dd>
              <dd>随时随地了解最新资讯，俱乐部内刊为您汇集并精选了最佳的酒店特惠信息、热点报刊新闻、独家竞赛消息以及更多精彩内容。</dd>
            </dl> 
            <p>成为全球奢华精品酒店S特别会员，首次入住后便可升级为L宠爱会员，享受更多会员特权。</p>
          </div>
        </li>
        <li v-show="tab3">
          <div class="page-title text-center"><div class="page-title-inner"><span>H尊荣会员-全球奢华精品酒店会员俱乐部</span></div></div>
          <div class="club-cont">
            <dl>             
              <dt>1年内5次以上入住便可升级为H尊荣会员。作为H尊荣会员，除了可享受S特别会员以及L宠爱会员的所有特权外，还将享受：</dt> 
              <dd>奖励免费入住一晚</dd>
              <dd>一旦成为尊贵的H尊荣会员，我们将为您发送优惠券代码，可在任意一家全球奢华精品酒店兑换免费住宿一晚。</dd>
              <dd>每五次入住之后，可额外享受一晚免费住宿，须在你的H尊荣会员期限内使用。</dd>
              <dd>奖励的额外住宿无次数限制</dd>
              <dd>5次入住须至少在两家不同的全球精品奢华酒店入住</dd>
              <dd>5次入住之间须均为非连续性入住</dd>
              <dd>必须通过slh.com或者我们的语音中心以及您的旅行社预订</dd>
              <dd>每次入住，享受优先客房升级*（视入住时的具体情况而定）</dd>
              <dd>作为H尊荣会员，我们将很高兴为您在每次入住全球精品奢华酒店时提供免费客房升级服务(视入住时的具体情况而定）。比S特别会员和L宠爱会员更有优先权，前提是有可供升级的房间。</dd>
              <dd>每次入住，享受提早优先入住*（视入住时的具体情况而定）</dd>
              <dd>作为H尊荣会员，您将享受提早优先入住权益（视入住时的具体情况而定），所以，入住全球任何一家全球奢华精品酒店，作为H尊荣会员，您都将拥有更充裕宽松的入住时间。</dd>
            </dl> 
            <p>成为全球奢华精品酒店S特别会员，首次入住后便可升级为L宠爱会员，享受更多会员特权。</p>
          </div>
        </li>
      </ul>
      <div class="club-footer text-center"><a href="club-registration.html" class="link-btn link-btn-green">立刻加入会员</a></div>
    </div>
  </div>
</template>

<script>

export default {
  name: 'club',
  data () {
    return {
      tab1: true,
      tab2: false,
      tab3: false
    }
  },
  methods: {
    handleMouseEnter (tabkey) {
      switch (tabkey) {
        case 1:
          this.tab1 = true
          this.tab2 = false
          this.tab3 = false
          break
        case 2:
          this.tab1 = false
          this.tab2 = true
          this.tab3 = false
          break
        case 3:
          this.tab1 = false
          this.tab2 = false
          this.tab3 = true
          break
      }
    }
  }
}
</script>
